<!-- 弹窗 详情 -->
<script lang="tsx" setup>
import FileUpload from "@/components/file-system/file-upload.vue";
import type { FormDescChild } from "@/components/form-desc/form-desc.vue";
import { jeecgBootSysUserEditUsingPost } from "@/genapi/system";
import { useAsync } from "@/hooks/use-async";
import FileOtherUpload from "@/components/file-system/file-otherUpload.vue";
import { ref } from "vue";
import {
	getEnumOptionsField,
	GATE_STATUS_OPTIONS,
	USER_TYPE_OPTIONS,
} from "@/config/enum-options";
import { useUserStore } from "@/stores/user";

const userStore = useUserStore();

defineOptions({ name: "DetailDialog" });

const img = import.meta.glob("./assets/*.png", {
	import: "default",
	eager: true,
});

const dialogRef = shallowRef<InstanceType<GlobalComponents["PromiseDialog"]>>();
const formDescRef = shallowRef<InstanceType<GlobalComponents["FormDesc"]>>();

const trigger = async (_type: "write" | "read" = "read", value = {} as any) => {
	model.value = JSON.parse(JSON.stringify(value)) as any;

	await dialogRef.value?.open();
};

defineExpose({
	trigger,
});

const model = ref({});
const value = ref("");

model.value = {
	id: userStore.userInfo?.id,
	// 名称
	realname: userStore.userInfo?.realname,
	// 公司名称
	orgName: userStore.userInfo?.orgName,
	// 公司营业执照号
	businessLicenses: userStore.userInfo?.businessLicenses,
	// 联系电话
	phone: userStore.userInfo?.phone,
	// 角色
	role: userStore.userInfo?.realname,
	// 状态
	status: userStore.userInfo?.status,
	// 密码
	password: "",
	// 确认密码
	password1: "",
};

const file = computed({
	get() {
		if (model.value.fileId) {
			return [
				{
					id: model.value.fileId,
					name: model.value.fileName,
				},
			];
		}
	},
	set(value: any) {
		model.value.fileId = value?.[0]?.id;
	},
});

const { execute, isLoading } = useAsync(async () => {
	await formDescRef.value?.formRef?.validate();
	await ElMessageBox.confirm("确认提交？", "提示", {
		type: "warning",
	});

	await jeecgBootSysUserEditUsingPost({
		data: {
			...model.value,
		},
	});
	ElMessage.success("提交成功");
});
const selectOptions = ref([{ label: "员工", value: "1" }]);

function getCurrentDate(): string {
	const now = new Date();
	const year = now.getFullYear();
	const month = String(now.getMonth() + 1).padStart(2, "0");
	const day = String(now.getDate()).padStart(2, "0");

	return `${year}-${month}-${day}`;
}
model.value.time = getCurrentDate();
const children: FormDescChild[] = [
	{
		label: "用户名",
		prop: "realname",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input v-model={model.value.realname} placeholder="请输入" />
		),
		descItem: () => `${model.value.realname ?? "-"}`,
	},
	{
		label: "公司名称",
		prop: "orgName",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input v-model={model.value.orgName} placeholder="请输入" />
		),
		descItem: () => `${model.value.orgName ?? "-"}`,
	},
	{
		label: "公司营业执照号",
		prop: "businessLicenses",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input v-model={model.value.businessLicenses} placeholder="请输入" />
		),
		descItem: () => `${model.value.businessLicenses ?? "-"}`,
	},
	{
		label: "联系电话",
		prop: "phone",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input v-model={model.value.phone} placeholder="请输入" />
		),
		descItem: () => `${model.value.phone ?? "-"}`,
	},
	{
		label: "角色",
		prop: "role",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input v-model={model.value.role} placeholder="请输入" />
		),
		descItem: () => `${model.value.role ?? "-"}`,
	},
	{
		label: "用户状态",
		prop: "status",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-select-v2
				v-model={model.value.status}
				options={USER_TYPE_OPTIONS}
				clearable
				placeholder="请选择类型"
			/>
		),
		descItem: () =>
			getEnumOptionsField(USER_TYPE_OPTIONS, "label", model.value.status) ??
			"-",
	},
	{
		label: "输入密码",
		prop: "password",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input
				type="password"
				v-model={model.value.password}
				placeholder="请输入"
			/>
		),
		descItem: () => `${model.value.password ?? "-"}`,
	},
	{
		label: "确认密码",
		prop: "confirmPwd",
		rule: [{ required: true, message: "请输入", trigger: "blur" }],
		span: 1,
		formItem: () => (
			<el-input
				type="password"
				v-model={model.value.confirmPwd}
				placeholder="请输入"
			/>
		),
		descItem: () => `${model.value.confirmPwd ?? "-"}`,
	},
];
</script>

<template>
	<div class="userDetailsContent">
		<span m="t-24px x-30px" style="font-size: 16px; font-weight: 600"
			>基本信息</span
		>
		<FormDesc
			ref="formDescRef"
			m="t-24px x-30px"
			type="form"
			form-class="gap-x-20px"
			:model="model"
			:children="children"
			:column="2"
		/>
		<div
			m="t-24px x--30px"
			style="width: 100%; display: flex; justify-content: flex-end"
		>
			<el-button type="primary" :is-loading="isLoading" @click="execute()">
				保存修改
			</el-button>
		</div>
	</div>
</template>

<style lang="scss" scoped>
.userDetailsContent {
	width: 80%;
	height: 600px;
}
</style>
